<template>
  <Tabbar>
    <TabbarItem path="/home">
      <template v-slot:item-icon>
        <span :class="['iconfont', 'icon-shouye', 'icon-size']"></span>
      </template>
      <template v-slot:item-active-icon>
        <span
          :class="['iconfont', 'icon-shouye', 'icon-size', 'icon-color']"
        ></span>
      </template>
      <template v-slot:item-text>
        <div class="tabbar-text">首页</div>
      </template>
    </TabbarItem>
    <TabbarItem path="/shoppingcart">
      <template v-slot:item-icon>
        <span :class="['iconfont', 'icon-gouwuche', 'icon-size']"></span>
      </template>
      <template v-slot:item-active-icon>
        <span
          :class="['iconfont', 'icon-gouwuche', 'icon-size', 'icon-color']"
        ></span>
      </template>
      <template v-slot:item-text>
        <div class="tabbar-text">购物车</div>
      </template>
    </TabbarItem>
    <TabbarItem path="/user">
      <template v-slot:item-icon>
        <span :class="['iconfont', 'icon-wode', 'icon-size']"></span>
      </template>
      <template v-slot:item-active-icon>
        <span
          :class="['iconfont', 'icon-wode', 'icon-size', 'icon-color']"
        ></span>
      </template>
      <template v-slot:item-text>
        <div class="tabbar-text">我的</div>
      </template>
    </TabbarItem>
  </Tabbar>
</template>

<script>
import TabbarItem from "@/common/TabbarItem/index.vue";
import Tabbar from "@/common/Tabbar/index.vue";

export default {
  components: {
    Tabbar,
    TabbarItem,
  },

  setup() {},
};
</script>

<style scoped>
</style>